<template>
  <div class="hello">
    <h1>{{ $store.state.msg }}</h1>
    <h1>{{ msg }}</h1>
    <h1>{{ reverseMsg }}</h1>
    <button @click="$store.commit('setMsg','hello world')">同步的方式，修改msg</button>
    <button @click="$store.dispatch('setMsgAsync',8471)">异步的方式，修改msg</button>
   
  </div>
</template>

<script>
export default {
  name: 'HelloWorld',
  data(){
    return {
      
    }
  },
  computed:{
    msg(){
      return this.$store.state.msg
    },
    reverseMsg(){
      return this.$store.getters.reverseMsg
    }
  },
}
</script>

<style scoped lang="less">

</style>
